<template>
  <div class="container">
      <div class='login_content'>
        <div class='user_photo'><open-data type="userAvatarUrl"></open-data></div>
        <div class='user_nickname'><open-data type="userNickName"></open-data></div>
        <button  v-if="canIUse" class="login_btn" open-type="getUserInfo" @getuserinfo="bindGetUserInfo">点击授权登录</button>
        <div v-else>请升级微信版本</div>
      </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      canIUse: wx.canIUse('button.open-type.getUserInfo')
    }
  },
  methods: {
    bindGetUserInfo(e){
      var _this=this;
      wx.getUserInfo({
        success:res =>{
          _this.$store.dispatch('setUserInfo',res);   //把获取到的用户的信息存放在vuex中进行管理
          _this.$request.getData('https://www.rzkeji.com/api/auth/wxLogin',{raw_data:res.rawData,signature:res.signature,code:_this.$store.state.modulesUser.userCode}).then(res =>{
            console.log(res)
           if(res.data.level=="success")
            {
              wx.setStorageSync('userToken',res.data.data);
              wx.switchTab({
                url:"/pages/home/main"
              })
            }else{
              wx.showToast({
                title:res.data.message,
                icon:'none',
                duration:2500
              })
            }
         }) 
        }
      })
    }
  },
}
</script>
<style scoped>
.login_content{width: 100%;position: absolute;left: 0;top: 20%;}
.user_photo{width: 200px;margin:0 auto;}
.user_nickname{text-align: center;margin-top: 20px}
button{margin-top: 30px;border-radius:2px;width: 68%;margin-left: 15%;border: solid 1px green;background-color: white;color: green}
</style>
